{extend name="./Template/Public/layout.html" /}
{block name="title"}Home{/block}
{block name="css"}
	<link href="__CSS__/lines.css" rel='stylesheet' type='text/css' />
	<!-- Nav CSS -->
	<link href="__CSS__/custom.css" rel="stylesheet">
	<link href="__CSS__/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
{/block}
<!-- jQuery -->
{block name="headjs"}
	<script src="__JS__/home/bootStrap/bootstrap-paginator.min.js"></script>
	<script type="text/javascript">
		var signQrcodeURL='{:Url("Home/Index/signQrcode","","")}',courseUpURL='{:Url("Home/Index/courseUp","","")}',export_file_excelURL='{:Url("Home/Index/export_file_excel","","")}';
		var indexURL='{:Url("Home/Index/index","","")}',geturlURL='{:Url("Home/Index/getUrl","","")}',getSignListURL='{:Url("Home/Index/getSignList","","")}';
	</script>
{/block}
{block name="content"}
<div id="wrapper">
     <!-- Navigation -->
        <div id="page-wrapper">
        <div class="graphs" id="app">
			<input id="selectdate" hidden v-model="selectdate">
			<input id="currentPage" hidden v-model="currentPage">
			<input id="isget" hidden v-model="isget">
			<button data-toggle="modal" data-target="#myModal3" hidden id="showSign"></button>
		    <div class="col_1">
				<div class="col-md-4 span_7">
				  <div class="cal1 cal_2"><div class="clndr"><div class="clndr-controls"><div class="clndr-control-button"><p class="clndr-previous-button">previous</p></div><div class="month">July 2015</div><div class="clndr-control-button rightalign"><p class="clndr-next-button">next</p></div></div><table class="clndr-table" border="0" cellspacing="0" cellpadding="0"><thead><tr class="header-days"><td class="header-day">S</td><td class="header-day">M</td><td class="header-day">T</td><td class="header-day">W</td><td class="header-day">T</td><td class="header-day">F</td><td class="header-day">S</td></tr></thead><tbody><tr><td class="day adjacent-month last-month calendar-day-2015-06-28"><div class="day-contents">28</div></td><td class="day adjacent-month last-month calendar-day-2015-06-29"><div class="day-contents">29</div></td><td class="day adjacent-month last-month calendar-day-2015-06-30"><div class="day-contents">30</div></td><td class="day calendar-day-2015-07-01"><div class="day-contents">1</div></td><td class="day calendar-day-2015-07-02"><div class="day-contents">2</div></td><td class="day calendar-day-2015-07-03"><div class="day-contents">3</div></td><td class="day calendar-day-2015-07-04"><div class="day-contents">4</div></td></tr><tr><td class="day calendar-day-2015-07-05"><div class="day-contents">5</div></td><td class="day calendar-day-2015-07-06"><div class="day-contents">6</div></td><td class="day calendar-day-2015-07-07"><div class="day-contents">7</div></td><td class="day calendar-day-2015-07-08"><div class="day-contents">8</div></td><td class="day calendar-day-2015-07-09"><div class="day-contents">9</div></td><td class="day calendar-day-2015-07-10"><div class="day-contents">10</div></td><td class="day calendar-day-2015-07-11"><div class="day-contents">11</div></td></tr><tr><td class="day calendar-day-2015-07-12"><div class="day-contents">12</div></td><td class="day calendar-day-2015-07-13"><div class="day-contents">13</div></td><td class="day calendar-day-2015-07-14"><div class="day-contents">14</div></td><td class="day calendar-day-2015-07-15"><div class="day-contents">15</div></td><td class="day calendar-day-2015-07-16"><div class="day-contents">16</div></td><td class="day calendar-day-2015-07-17"><div class="day-contents">17</div></td><td class="day calendar-day-2015-07-18"><div class="day-contents">18</div></td></tr><tr><td class="day calendar-day-2015-07-19"><div class="day-contents">19</div></td><td class="day calendar-day-2015-07-20"><div class="day-contents">20</div></td><td class="day calendar-day-2015-07-21"><div class="day-contents">21</div></td><td class="day calendar-day-2015-07-22"><div class="day-contents">22</div></td><td class="day calendar-day-2015-07-23"><div class="day-contents">23</div></td><td class="day calendar-day-2015-07-24"><div class="day-contents">24</div></td><td class="day calendar-day-2015-07-25"><div class="day-contents">25</div></td></tr><tr><td class="day calendar-day-2015-07-26"><div class="day-contents">26</div></td><td class="day calendar-day-2015-07-27"><div class="day-contents">27</div></td><td class="day calendar-day-2015-07-28"><div class="day-contents">28</div></td><td class="day calendar-day-2015-07-29"><div class="day-contents">29</div></td><td class="day calendar-day-2015-07-30"><div class="day-contents">30</div></td><td class="day calendar-day-2015-07-31"><div class="day-contents">31</div></td><td class="day adjacent-month next-month calendar-day-2015-08-01"><div class="day-contents">1</div></td></tr></tbody></table></div></div>
				</div>
				<div class="col-md-8 span_3">
					<nav class="top1 navbar navbar-default" role="navigation" style="margin-bottom: 0;background-color: #ffc107;border-color: #fdd835;">
						<div class="navbar-form navbar-left">
							<input type="text" class="form-control search" value="" v-model="search"  placeholder="请输入课程名进行检索">
							<span class="label label-primary">{{filteredList.length }}条</span>
						</div>
					</nav>
				  <div class="bs-example1" data-example-id="contextual-table">
					  <table class="table table-hover table-bordered table-striped">
						  <thead>
						  <tr class="warning">
							  <th>序号</th>
							  <th>课程名称</th>
							  <th>课程日期 <span class="label label-default">{{selectdate|getWeek}}</span></th>
							  <th>主会场</th>
							  <th>主讲人</th>
							  <th>操作</th>
						  </tr>
						  </thead>
						  <tbody>
						  <tr  v-for="(index,todo) in todos|filterBy search in 'name'" >
							  <th scope="row" class="col-md-1">{{index+1}}</th>
							  <td class="col-md-2">
								  <a v-on:click="geturl(index)">{{todo.name}}</a>
								  <span v-if="todo.sign_count" v-on:click="getSignList(index)" class="label label-success">已签{{todo.sign_count}}</span>
							  </td>
							  <td class="col-md-3">
								  {{todo.course_time_start|unix_to_datetime}}至{{todo.course_time_end|unix_to_datetime}}
							  </td>
							  <td class="col-md-2">
								  {{todo.course_place}}
							  </td>
							  <td class="col-md-2">
								  {{todo.course_speaker}}
							  </td>
							  <td class="col-md-2" v-bind:course_id="todo.course_id">
								  <div class="col-md-12"><button v-on:click="setvalue(index)"  type="button" class="edit btn-sm btn-info"  data-toggle="modal" data-target="#myModal" v-show="todo.course_time_start|after_today">编辑</button></div> <!--v-show="todo.course_time_start|after_today"-->
								  <div class="col-md-12"><button v-on:click="qrcode(index)" class="exportqrcode btn-sm btn-primary" data-toggle="modal" data-target="#myModal2">导出二维码</button></div>
								  <div class="col-md-12"><button v-on:click="export_file(index)" class="exportexcel btn-sm btn-success warning_3" v-show="todo.course_time_start|before_today">导出签到表</button></div>
							  </td>
						  </tr>
						  </tbody>
					  </table>
					  <div class="bs-example2 bs-example-padded-bottom">
						  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
							  <div class="modal-dialog">
								  <div class="modal-content">
									  <div class="modal-header">
										  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
										  <h2 class="modal-title">课程编辑</h2>
									  </div>
									  <div class="modal-body">
										  <div class="form-group">
											  <label class="control-label">课程名：</label>
											  <input type="text" v-on:focus="warn.name=0" name="coursename" v-model="course_edit.name"  class="form-control1 ">
											  <div v-show="warn.name" class="coursewarn alert alert-warning">警告！课程名不能为空。</div>
										  </div>
										  <div class="form-group">
											  <label class="control-label normal">课程日期：</label></br>
											  <input type="text" v-on:focus="warn.time_start=0" name="coursetime_start" v-model="course_edit.course_time_start|edit_unix_to_datetime" class="form-control1 form_datetime_start"  style="width: 30%"  placeholder="单击此处设置课程开始时间">-
											  <input type="text" v-on:focus="warn.time_end=0" v-on:onchange="checkendtime"  name="course_time_end" v-model="course_edit.course_time_end|edit_unix_to_datetime" class="form-control1 form_datetime_end" data-date="{{coursetime_start}}"  style="width: 30%"  placeholder="单击此处设置课程结束时间">
											  <div v-show="warn.time_start||warn.time_end"  class="alert alert-warning" >警告！课程时间不能为空。</div>
											  <div hidden  class="alert alert-warning warntime" >警告！结束时间不能小于开始时间。</div>
										  </div>
										  <div class="form-group">
											  <label class="control-label">地点：</label>
											  <input type="text" v-on:focus="warn.place=0" name="courseplace" v-model="course_edit.course_place"  class="form-control1 " required="">
											  <div v-show="warn.place" class="coursewarn alert alert-warning">警告！课程地点不能为空。</div>
										  </div>
									  </div>
									  <div class="modal-footer">
										  <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
										  <button v-on:click="courseUpdate" type="button" class="btn btn-primary">保存</button>
									  </div>
								  </div><!-- /.modal-content -->
							  </div><!-- /.modal-dialog -->
						  </div>
						  <div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
							  <div class="modal-dialog">
								  <div class="modal-content">
									  <div class="modal-header">
										  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
										  <h2 class="modal-title">课程二维码</h2>
									  </div>
									  <div class="modal-body">
										  <img v-bind:src="qrcode_path">
									  </div>
									  <div class="modal-footer">
										  <button type="button" class="btn btn-primary" data-dismiss="modal">确定</button>
									  </div>
								  </div><!-- /.modal-content -->
							  </div><!-- /.modal-dialog -->
						  </div>
						  <div class="modal fade" id="myModal3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
							  <div class="modal-dialog">
								  <div class="modal-content">
									  <div class="modal-header">
										  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
										  <h2 class="modal-title">课程编辑</h2>
									  </div>
									  <div class="modal-body">
										  <table class="table table-hover table-bordered table-striped">
											  <thead>
											  <tr class="warning">
												  <th>序号</th>
												  <th>工号</th>
												  <th>姓名</th>
												  <th>地点</th>
												  <th>时间<span class="label label-default">{{selectdate|getWeek}}</span></th>
											  </tr>
											  </thead>
											  <tbody>
											  <tr  v-for="(index,todo) in SignList" >
												  <th scope="row" class="col-md-1">{{index+1}}</th>
												  <td class="col-md-3">
													  <a v-on:click="geturl(index)">{{todo.user_id}}</a>
													  <span v-if="todo.sign_count" class="label label-success" data-toggle="modal" data-target="#myModal3">已签{{todo.sign_count}}</span>
												  </td>
												  <td class="col-md-2">
													  {{todo.user_name}}
												  </td>
												  <td class="col-md-3">
													  {{todo.sign_place}}
												  </td>
												  <td class="col-md-3">
													  {{todo.creat_time|unix_to_datetime}}
												  </td>
											  </tr>
											  </tbody>
										  </table>
									  </div>
									  <div class="modal-footer">
										  <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
									  </div>
								  </div><!-- /.modal-content -->
							  </div><!-- /.modal-dialog -->
						  </div>
					  </div>
				  </div>
					  <ul id ="example"></ul>
				  </div>
			  </div>
				<div class="clearfix"> </div>
			  <!----Calender -------->
			  <link rel="stylesheet" href="__CSS__/clndr.css" type="text/css" />
			  <script src="__JS__/underscore-min.js" type="text/javascript"></script>
			  <script src= "__JS__/moment-with-locales.min.js" type="text/javascript"></script>
			  <script src="__JS__/clndr.js" type="text/javascript"></script>
			  <script src="__JS__/site.js" type="text/javascript"></script>
			  <!----End Calender -------->
		  </div>
		</div>
       </div>
      <!-- /#page-wrapper -->
   </div>
    <!-- /#wrapper -->
    <!-- Bootstrap Core JavaScript -->
    <script src="__JS__/bootstrap.min.js"></script>
{/block}
{block name="bodyjs"}
	<script src="__JS__/home/index.js"></script>
	<script type="text/javascript" src="__JS__/home/bootStrap/bootstrap-datetimepicker.min.js" charset="UTF-8"></script>
	<script type="text/javascript" src="__JS__/home/bootStrap/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
	<script type="text/javascript">
		function getLocalTime(nS) {
			var d = new Date();
			d.setTime(nS);
			return d.toLocaleString().replace(/:\d{1,2}$/,' ');
		}
		$('.form_datetime_start').datetimepicker({
			format:'yyyy-mm-dd hh:ii',
			language:  'zh-CN',
			weekStart: 1,
			todayBtn:  1,
			autoclose: 1,
			todayHighlight: 1,
			startView: 2,
			forceParse: 0,
			showMeridian: 1
		});
		$('.form_datetime_start').datetimepicker().on('changeDate', function(ev){
			var q=getLocalTime(ev.date.valueOf());
			$('.form_datetime_end').val('').datetimepicker('setStartDate', q);
		});
		$('.form_datetime_end').datetimepicker({
			format:'yyyy-mm-dd hh:ii',
			language:  'zh-CN',
			weekStart: 1,
			todayBtn:  1,
			autoclose: 1,
			todayHighlight: 1,
			startView: 1,
			minView: 0,
			forceParse: 0,
			showMeridian: 1
		});
		$('.form_datetime_end').click(function(){
			$('.warntime').hide();
		});
		$('.form_datetime_end').datetimepicker().on('changeDate', function(ev){
			var q=ev.date.valueOf(),t=Date.parse($('.form_datetime_start').val());
			var m=q<t;
			if(m){
				$('.warntime').show();
			}
		});
	</script>
{/block}
</html>
